<template>
  <div class='home-header'>
    <div v-if="role == '1'" class='admin-botton-list'>
      <ul class="one-ul">
        <li><a v-on:click="toCreateHomework">发布作业</a></li>
        <li><a v-on:click="toCreateNotice">发布通知</a></li>
        <li><a v-on:click="toHelpStudent">专治奇难杂症</a></li>
        <li><img src="~@/assets/img/bar/empty.png" class="trashBin"><a v-on:click="toRecovery">回收站</a></li>
      </ul>
      <!-- <div>
        <ul class="one-ul">
          <li><img src="~@/assets/img/bar/empty.png" class="trashBin"></li>
          <li><a v-on:click="toRecovery">回收站</a></li>
        </ul>
      </div> -->
    </div>
    <div v-else-if="role == '0'" class='stu-botton-list'>
        <ul class="one-ul">
          <li><a v-on:click="toAskQuestion">奇难杂症</a></li>
          <li></li>
          <li></li>
          <li></li>
        </ul>
    </div>
  </div>
</template>
<script>
/* eslint-disable */
import { eventBus } from '@/util/eventBus';
export default {
	name: 'home-header',
  components: {
		eventBus,
	},
	data() {
		return {
      role: window.localStorage.getItem('userRole'),
      // role=1：学委，role=0：学生
		};
  },
  methods: {
    toRecovery() {
      this.$router.push('/trashBin');
    },
    toCreateNotice() {
      this.$router.push('/AdaCreateNotice');
    },
    toCreateHomework() {
      this.$router.push('/AdaCreateHomework');
    },
    toHelpStudent() {
      this.$router.push('/AdaQuestion');
    },
    toAskQuestion() {
      this.$router.push('/StuQuestion');
    }
  }
};
</script>
<style scoped>
.home-header{
	display: flex;
	/* float: left; */
	font-size: .4rem;
	/* margin-top: -0.1rem; */
	/* margin-left:  0.3rem; */
}
.admin-botton-list{
  float: right;
	margin: -.8rem 0 0 10rem;
	/* line-height: -4rem; */
	overflow: hidden;
	display:flex;
	justify-content: flex-end;
	align-items: flex-end;
}
.stu-botton-list{
  margin: -.8rem 0 0 10rem;
  height: .9rem;
  overflow: hidden;
	display:flex;
	justify-content: flex-end;
	align-items: flex-end;
}
a{
  cursor: pointer;
  color: #66cccc;
}
a:hover{
  color: #FAACA8;
}
.one-ul{
	width: 10rem;
  line-height: .5rem;
	height: .9rem;
	display: flex;
  /* float: left; */
	align-items: flex-start;
	justify-content: space-around;
	/* padding: 0 0.06rem; */
}
.trashBin{
  width: .5rem;
  height: .5rem;
  margin: -0.1rem .1rem 0 0;
}
.admin-botton-list>div:first-child{
    width: 0;
    height: 0;
    border-color: rgb(20,161,213) transparent;
    border-width: 0 0 22px 30px;
    border-style: solid;
}
.two-ul{
  display: flex;
  margin: -.8rem 0 0 11rem;
  /* display: flex;
  width: 2rem;
  line-height: 1rem;
  float: right;
  margin: -2.5rem 0 0 0rem;
  display: flex;
	align-items: flex-start;
	justify-content: space-around; */
}
</style>
